// import { useIntersectionObserver } from '@vueuse/core'
import { directivePlugin } from '@/directives/index'
import 'element-plus/dist/index.css'
import '@/styles/common.scss'
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import { compoentPlus } from '@/components/index'
import persist from 'pinia-plugin-persistedstate'
import App from './App.vue'
import router from './router'
const app = createApp(App)
app.use(compoentPlus)
app.use(createPinia().use(persist))
app.use(router)
app.use(directivePlugin)
app.mount('#app')

// 空指令实现


// // focus:指令的名字
// app.directive('imgLazy', {
//    mounted(el, binding) {
//     // el：指令绑定的那个元素
//     // binding.value:绑定的元素的值，等号后边的值
//     console.log(el,binding.value);
//      useIntersectionObserver(
//       el,//监听谁 el(所要加载的图片是我们想要监听的对象)
//       ([{ isIntersecting }]) => {
//         // isIntersecting布尔值ture或者false，在视口区域是true，不在视口区域就是false
//         if(isIntersecting){
//             // 如果isIntersecting为true代表进入到了视口区域那么拿到图片给他赋予一个地址(el就是图片，binding.value就是地址)
//             el.src = binding.value
//         }
//       },
//     )
//    },

// })

